<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			div{position: absolute;font:700 40px/46px "";}
		</style>
		
	</head>
	<body>
	</body>
</html>
<script>
	
	//定时器--创建div和随机字母
	setInterval(function(){	
		var cDiv = document.createElement('div');	//创建div
		var code = String.fromCharCode(parseInt(65+Math.random()*26));
		cDiv.innerHTML = code;
		var left = parseInt(50+Math.random()*1200);
		cDiv.style.left = left +'px';
		document.body.appendChild(cDiv);
		clearmove(cDiv)
	},1000)

	//超出屏幕移除和关闭定时器
	function clearmove(ele) {		//ele是形参,随便取名字
		var t = 0;
		var timer = setInterval(function(){
			t+=3;
			ele.style.top = t +'px';
			if (t>600) {
			clearInterval(timer);
			ele.remove()
			}
		},50)	
	}

	//onkeydown 打字的时候执行的代码
	document.onkeydown = function(e) {
		var e = e||event;
		var rDiv = document.getElementsByTagName('div');
		console.log(rDiv);
		for (var i=0;i<rDiv.length;i++){
			if (rDiv[i].innerHTML ==String.fromCharCode(e.keyCode)) {
				rDiv[i].remove()
			}
		}
		
	}


	
	
	
</script>
